Skip to content

Redesign McpMux glyph to simplified dots + bold M layout - #66

Merged
its-mash merged 6 commits into
mainfrom
claude/review-logo-sizes-Z5V7A
Feb 11, 2026
Merged

Redesign McpMux glyph to simplified dots + bold M layout#66
its-mash merged 6 commits into
mainfrom
claude/review-logo-sizes-Z5V7A

Conversation

@its-mash

Copy link
Copy Markdown
Member

Summary

Simplified the McpMux brand glyph from a complex neural router visualization to a cleaner, more compact design featuring three dots on each side with a bold "M" in the center.

Changes

  • Glyph redesign: Replaced intricate input/output curves and nodes with a minimalist three-dot pattern on left and right sides
  • Central element: Simplified the hub visualization to a bolder, more prominent "M" character
  • Updated SVG paths: Adjusted stroke widths, positioning, and opacity values to match the new design across both the React component and public SVG asset
  • Icon regeneration: Regenerated all application icons (PNG, ICO, ICNS formats) to reflect the new glyph design
  • Documentation: Updated screenshot assets to show the new branding

Implementation Details

  • The new glyph maintains the brand gradient (orange to rust) while reducing visual complexity
  • Dot sizing and opacity are consistent (1.6-1.8 radius, 0.7-0.85 opacity) to create visual hierarchy
  • The bold M uses increased stroke width (1.5 in React component, 2 in SVG) for better visibility at small scales
  • All coordinates were recalculated to center the design and improve proportions

https://claude.ai/code/session_01J4whZ2FE8DHRZJo7tZeW5m

claude and others added 6 commits February 11, 2026 08:06
The compacted taskbar icon (dots only, no connecting curves) looks cleaner
and more iconic than the full logo with lines, especially at larger sizes.
Adopt this as the standard logo across the entire app:

- Update mcpmux.svg to use compacted design (dots + bold M, no lines)
- Update McpMuxGlyph inline SVG component in App.tsx to match
- Regenerate all icon sizes (PNG, ICO, ICNS) from new SVG
- Update all 7 screenshots with the new title bar glyph

https://claude.ai/code/session_01J4whZ2FE8DHRZJo7tZeW5m
The title bar glyph was rendering gradient-colored elements on a
transparent background, looking nothing like the actual app icon.
Replace it with a miniature of the real logo: gradient rounded-rect
background with white dots + bold M inside.

https://claude.ai/code/session_01J4whZ2FE8DHRZJo7tZeW5m
Previous screenshot edits left remnant pixels from the old glyph
(at x=29-32 and below the icon). Clear a larger area (x=5..38,
y=1..28) before placing the clean icon to remove all artifacts.

https://claude.ai/code/session_01J4whZ2FE8DHRZJo7tZeW5m
Scale icon from h-5 (20px) to h-4 (16px) to better match the text-sm
text size, matching the proportions on mcpmux.com. Vertically centered
at 10px from top in the 36px title bar.

https://claude.ai/code/session_01J4whZ2FE8DHRZJo7tZeW5m
Reduces spacing between icon and McpMux text from 8px to 6px
for a tighter, more cohesive title bar layout.

https://claude.ai/code/session_01J4whZ2FE8DHRZJo7tZeW5m
@its-mash
its-mash merged commit 93f04c5 into main Feb 11, 2026
1 check passed
@its-mash
its-mash deleted the claude/review-logo-sizes-Z5V7A branch February 11, 2026 10:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants